/*css reset*/
*{margin: 0;padding: 0; }
fieldset, img {border: 0;}
input,textarea,select{ padding:0 3px;-webkit-appearance:none; outline:none;border-radius: 0;}
ol, ul {list-style: none;}
h1, h2, h3, h4, h5, h6{font-size:100%;}
table {border-collapse: collapse;}
body{ margin:0 auto; font-size:14px; font-family:"寰蒋闆呴粦","Heiti SC","榛戜綋"; line-height:1.5; color:#000; }
a,li{-webkit-tap-highlight-color:rgba(255,0,0,0);}
a{color:#000;text-decoration:none; outline:none;}
a:hover{color:#000; text-decoration:none;}
img{width: 100%; vertical-align: bottom;}
html,body{height: 100%;}
.m-img{width: 100%;height: 100%;}

/*base css*/
.clearfix:after{content:" ";height:0;visibility:hidden;display:block;clear:both;}

/*wrapper*/
.wrapper{max-width:640px; min-width:320px; margin:0 auto; height: 100%;}
.ring{width: 100%;height: 100%;background: url(../images/bg1.png) no-repeat; background-size: cover; background-position: 50% 50%; position: relative;}
.answerbar{width: 100%;overflow: hidden; position: absolute;left: 0; top:74%; text-align: center;}
.answer{width: 56px;height: 56px; margin: 0 auto;}

.musicbar{position: absolute;right: 10px;top: 10px;z-index: 200;width: 50px;height: 50px;  background: url(../images/music_off.png) center no-repeat; background-size:30px 30px;}
.music_on{background: url(../images/music.gif) no-repeat; background-size:cover; }
.yinfu{background: url(../images/music_off.png) no-repeat; width: 30px;height: 30px; margin: 10px; background-size:cover; }
.music_on .yinfu{-webkit-animation:rotating 1.2s linear infinite;-moz-animation:rotating 1.2s linear infinite;-o-animation:rotating 1.2s linear infinite;animation:rotating 1.2s linear infinite}
@-webkit-keyframes rotating{
    from{-webkit-transform:rotate(0deg)}
    to{-webkit-transform:rotate(360deg)}
}
@keyframes rotating{
    from{transform:rotate(0deg)}
    to{transform:rotate(360deg)}
}
@-moz-keyframes rotating{
    from{-moz-transform:rotate(0deg)}
    to{-moz-transform:rotate(360deg)}
}

.incall{width: 100%;height: 100%;background: url(../images/bg2.jpg) no-repeat; background-size: cover; background-position: 50% 50%; position: relative;}
.zoomIn{-webkit-animation:zoomIn 1s ease 0s infinite both;-moz-animation:zoomIn 1s ease 0s infinite both;animation:zoomIn 1s ease 0s infinite both}
@-webkit-keyframes zoomIn{
0%{opacity:0;
-webkit-transform:scale3d(.3,.3,.3);
transform:scale3d(.3,.3,.3)
}
50%{opacity:1}
}
@keyframes zoomIn{
0%{opacity:0;
-webkit-transform:scale3d(.3,.3,.3);
transform:scale3d(.3,.3,.3)
}
50%{opacity:1}
}
@-moz-keyframes zoomIn{
0%{opacity:0;
-moz-transform:scale3d(.3,.3,.3);
transform:scale3d(.3,.3,.3)
}
50%{opacity:1}
}

.hangup{ width: 100%; text-align: center; color: #fff; font-size: 16px; position: absolute; left: 0; top:65%;}
.tiptxt{width: 100%; text-align: center; color: #fff; font-size: 16px; position: absolute; left: 0; top:16%;}
.tiptxt .cont{position: relative; width: 100%;}
.tiptxt p{position: absolute;left: 0;top:0;width: 100%; opacity: 0; -webkit-transition: all ease-in-out 0.8s 0.5s;
-o-transition: all ease-in-out 0.8s 0.5s;
transition: all ease-in-out 0.8s 0.5s}
@-webkit-keyframes fadeOut{
0%{opacity:0;}
50%{opacity:1}
100%{opacity: 0;}
}
@keyframes fadeOut{
0%{opacity:0;}
50%{opacity:1}
100%{opacity: 0;}
}
@-moz-keyframes fadeOut{
0%{opacity:0;}
50%{opacity:1}
100%{opacity: 0;}
}
.tiptxt .p1{-webkit-animation:fadeOut 3s ease 2s 1 both;-moz-animation:fadeOut 3s ease 2s 1 both;animation:fadeOut 3s ease 2s 1 both}
.tiptxt .p2{-webkit-animation:fadeOut 3s ease 6s 1 both;-moz-animation:fadeOut 3s ease 6s 1 both;animation:fadeOut 3s ease 6s 1 both}
.tiptxt .p3{-webkit-animation:fadeOut 3s ease 10s 1 both;-moz-animation:fadeOut 3s ease 10s 1 both;animation:fadeOut 10s ease 4s 1 both}
.tiptxt .p4{-webkit-animation:fadeOut 3s ease 14s 1 both;-moz-animation:fadeOut 3s ease 14s 1 both;animation:fadeOut 14s ease 6s 1 both}


.fl{float:left;display:inline;}
.fr{float:right;display:inline;}
.clear:after,.tab-title:after{content:"";display:block;clear:both;height:0;line-height:0;overflow:hidden;font-size:0;}
.clear.tab-title{zoom:1;}
.fixbottom,.fixtop{position:fixed;left:0;bottom:0;width:100%;height:82px;background:rgba(0,0,0,.6);z-index:2}
.fixbottom .containWrap,.fixtop .containWrap{position:absolute;left:0;top:0;width:100%;height:100%;bottom:0;}
.fixtop{top:0;bottom:auto;}
.m15{margin-top:15px;}
.m25{margin-top:25px;}
.space_5{padding:5px 0 0 0;}
.space_10{padding:10px 0 0 0;}
.space_15{padding:15px 0 0 0;}
.space_20{padding:20px 0 0 0;}
.space_30{padding:30px 0 0 0;}
.tc{text-align:center;}
.tr{text-align:right;}


.title h3{
	position:fixed;top:0;left:0;z-index:1;
	width:100%;height:100px;text-align:center;
	font:30px/100px "黑体";color:#fff;
}
.title p{
	position:fixed;top:80px;left:0;z-index:1;
	width:100%;height:20px;text-align:center;
	font:14px/20px "黑体";color:#fff;
}


.prompt .cont{
    position:fixed;top:50%;left:0;z-index:15;
    width:90%;height:150px;color:#666;
    margin:-85px 5% 0;padding:10px 0;
    border-radius:3px;
    text-align:center;
    background:#fff;
}
.prompt .cont h3{
    color:#ab1e27;
    font:18px/40px "黑体";
}
.prompt .cont p{
    color:#666;
    margin:5px 0;
    font:14px/25px "黑体";
}
.prompt .bg{
    position:fixed;left:0;top:0;z-index:14;
    width:100%;height:100%;
    background:rgba(0,0,0,.5)
}
.prompt .btns{
    margin-top:10px;
    font:16px/32px "黑体";text-align:center;
}
.prompt .btns a{
    display:inline-block;
    min-width:60px;height:32px;color:#fff;
    padding:0 10px;
    border-radius:3px;
    background:#26ca00;
}

.share{
    position:fixed;top:0;left:0;z-index:1000;
    width:100%;height:100%;color:#fff;
    font:14px/30px "黑体";
    background:rgba(0,0,0,.75);
}
.share img{
    float:right;
    width:30px;
    margin:10px;
}
.share p{
    padding:0 10px;
    text-align:right;










